<template>
    <div class="storeInfo">
        <div class="head">    
            <el-form :model="form" class="headForm">
                <el-form-item>
                    <el-input v-model="form.mobile" placeholder="输入查询的电话号码"></el-input>
                </el-form-item>

                <el-button type="primary" icon="el-icon-search" @click="search">搜索</el-button>
            </el-form>      
        </div>
         
        <!-- tab部分 -->
        <div class="tabContainer">
            <el-table :data="tableData" stripe style="width: 100%;text-align:center">
                <!--序号	发送时间	手机号	短信内容	状态	备注 -->
                <el-table-column prop="" label="序号" fixed>
                    <template slot-scope="scope">
                        {{scope.$index+1}} 
                    </template>
                </el-table-column>
                <el-table-column prop="create_time" label="发送时间"></el-table-column>
                <el-table-column prop="mobile" label="手机号"></el-table-column>
                <el-table-column prop="content" label="短信内容"></el-table-column>
                <el-table-column prop="source_cn" label="状态">
                    <template slot-scope="scope">
                        <p v-if="scope.row.status == -1">失败</p>
                        <p v-else>成功</p>
                    </template>
                </el-table-column>
                <el-table-column prop="error_content" label="备注">
                    <template slot-scope="scope">
                        <p v-if="scope.row.status == -1">{{scope.row.error_content}}</p>
                        <p v-else>--</p>
                    </template>
                </el-table-column>
            </el-table>
                        
        </div>
        <!-- 分页部分 -->
        <!-- 分页部分 -->
        <el-pagination
            background
            layout="total, prev, pager, next, jumper"
            @current-change="changePage"
            :page-size="size"
            :current-page.sync="pageNum"
            :hide-on-single-page=true
            :total="total">{{total}}
        </el-pagination>

    </div>
</template>
<style lang="scss">
.prizeBox{
    .el-form-item__content{
        display: flex;
        flex-direction: row;
        justify-content:space-between;
        .goodsearch{
            width:333px;
        }
        .quntanty{
            width:130px;
        }
    }
}
</style>
<script>
import { abc } from "../../../../js/abc.js";
import {potUrl} from '../../../../js/config_url.js'; 
export default {
    data(){
        return {          
            tableData:[],
            total:50,
            size:20,
            pageNum:1,
            form:{
                size:20,
                page:1
            },

        }
    },
    mounted(){
        var that = this;
        that.getList()       
    },
    methods:{
        search(){
            const that = this;
            that.getList();
        },          
        changePage(val){
            var that = this;
            that.pageNum = val;
            this.form.page = val;
           that.getList()
        },
        getList(){
            const that = this;
            abc.get(that,potUrl.smslist,that.form,(res)=>{
                that.tableData = res.data.list;
                that.total = res.data.total;
            })
        }

    }
}

</script>